<template>
	<view class="container">
		<!-- #ifdef MP-WEIXIN -->
		<!-- #endif -->
		<u-navbar back-text="返回" :title="conversationName">
			<view slot="right" class="right-icon" @click="goMember" v-if="conversation.type === 'GROUP'">
				<image src="@/static/IM/chengy.png" style="width:40rpx;height:40rpx;margin-right:20rpx;"></image>
			</view>
		</u-navbar>
		<view class="message-list" @tap="triggerClose">
			<TUI-message-list id="message-list" ref="messageList" :conversation="conversation" v-if="Object.keys(conversation).length != 0"/>
		</view>
		<view v-if="videoPlay" class="container-box" @tap.stop="stopVideoHander">
			<video v-if="videoPlay" class="video-message" :src="videoMessage.payload.videoUrl"
				:poster="videoMessage.payload.thumbUrl" object-fit="cover" error="videoError" autoplay="true"
				direction="0" />
		</view>
		<view v-if="showChat" class="message-input">
			<TUI-message-input id="message-input" ref="messageInput" :conversation="conversation"
				@sendMessage="sendMessage" />
		</view>
	</view>
</template>

<script>
	import logger from '@/utils/logger';
	import TUIMessageList from '@/components/tui-chat/message-list/index.vue';
	import TUIMessageInput from '@/components/tui-chat/message-input/index';
	import TUIGroupProfile from '@/components/tui-group/group-profile/index';
	const app = getApp();
	export default {
		components: {
			TUIMessageList,
			TUIMessageInput,
			TUIGroupProfile
		},
		props: {},
		data() {
			return {
				conversationName: '',
				conversation: {},
				messageList: [],
				isShow: false,
				showChat: true,
				conversationID: '',
				videoPlay: false,
				videoMessage: {},
				config: {
					sdkAppID: '',
					userID: '',
					userSig: '',
					type: 1,
					tim: null
				}
			};
		},
		created() {
			uni.$on('videoPlayerHandler', value => {
				this.videoPlay = value.isPlay;
				this.videoMessage = value.message;
			});
		},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			// conversationID: C2C、 GROUP
			logger.log(` TUI-chat | onLoad | conversationID: ${options.conversationID}`);
			const {
				conversationID
			} = options;
			this.setData({
				conversationID
			});
			// #ifdef MP-WEIXIN
			// this.config = {
			// 	sdkAppID: app.globalData.SDKAppID,
			// 	userID: app.globalData.userInfo.userID,
			// 	userSig: app.globalData.userInfo.userSig
			// }
			// logger.log(`TUI-chat | TUICalling-config  | config:${JSON.stringify(this.callingConfig)}`);
			// // 挂载在 uni 上
			// uni.$wxTUICalling = this.$refs.TUICalling;
			// 		this.$nextTick(() => {
			// 			uni.$wxTUICalling.init()
			// })
			// #endif
			uni.$TUIKit
				.setMessageRead({
					conversationID
				})
				.then(() => {
					logger.log('TUI-chat | setMessageRead  | ok');
				});
			uni.$TUIKit.getConversationProfile(conversationID).then(res => {
				const {
					conversation
				} = res.data;
				this.conversation = conversation;
				console.log(conversation.type, '测试')
				this.setData({
					conversationName: this.getConversationName(conversation),
					isShow: conversation.type === 'GROUP'
				});
			});
		},
		mounted() {},
		onUnload() {
			// #ifdef MP-WEIXIN
			//   this.$refs.TUICalling.destroyed();
			// // #endif
		},
		methods: {
			// 跳转到群成员列表
			goMember() {
				uni.navigateTo({
					url: '/pages/subpackage/IM/TUI-Chat/member?conversation=' + JSON.stringify(this.conversation)
				})
			},
			stopVideoHander() {
				this.videoPlay = false;
			},
			getConversationName(conversation) {
				if (conversation.type === '@TIM#SYSTEM') {
					this.setData({
						showChat: false
					});
					return '系统通知';
				}

				if (conversation.type === 'C2C') {
					return conversation.remark || conversation.userProfile.nick || conversation.userProfile.userID;
				}

				if (conversation.type === 'GROUP') {
					return conversation.groupProfile.name || conversation.groupProfile.groupID;
				}
			},

			sendMessage(event) {
				// 将自己发送的消息写进消息列表里面
				this.$refs.messageList.updateMessageList(event.detail.message);
			},

			triggerClose() {
				if (this.showChat) {
					this.$refs.messageInput.handleClose();
				}
			},

			goBack() {
				console.log('触发')
				const pages = getCurrentPages(); // 当前页面栈

				if (
					pages[pages.length - 2].route === 'pages/TUI-Conversation/create-conversation/create' ||
					pages[pages.length - 2].route === 'pages/TUI-Group/create-group/create' ||
					pages[pages.length - 2].route === 'pages/TUI-Group/join-group/join'
				) {
					uni.navigateBack({
						delta: 2
					});
				} else {
					uni.navigateBack({
						delta: 1
					});
				}

				uni.$TUIKit
					.setMessageRead({
						conversationID: this.conversationID
					})
					.then(() => {});
			}
		}
	};
</script>
<style>
	@import './chat.css';
</style>